import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    // 定义一个仓库用来存储数据
    toList: []//用来存储对象形式的数据{id:1,name:'代办',status:false}
  },
  getters: {//定义计算方法，类似于组件中的计算属性
    // 统计未完成任务的数量
    unFinish(state) {
      // 过滤出toList中状态为false的
      var arr = state.toList.filter((item) => {
        return item.status == false;
      })
      return arr.length
    }
  },
  mutations: {//同步任务
    // 点击增加触发的事件
    addList(state, payload) {
      // 第一个参数：保存数据的state对象
      // 第二个参数：传入的参数
      // 构建一个新的任务对象，status属性表示任务的状态
      var obj = { id: state.toList.length + 1, name: payload, status: false }
      state.toList.push(obj);
    },
    // 点击input选框改变状态的事件
    changeStatus(state, payload) {
      var fi = state.toList.find((item) => {
        return item.id == payload.id
      });
      //判断是否找到fi，fi不为空则找到，然后改变状态为true
      if (fi) {
        fi.status = !fi.status
      }
    }
  },
  actions: {
  },
  modules: {
  }
})
